﻿<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                    xmlns:s="clr-namespace:Microsoft.Surface.Presentation.Controls;assembly=Microsoft.Surface.Presentation"
                    xmlns:cs="clr-namespace:CitiSurface">
    <!--
    General Resources dictionary
    -->
    
    <Style x:Key="TileStyle" TargetType="{x:Type Label}">
        <Setter Property="HorizontalAlignment" Value="Left"/>
        <Setter Property="Foreground" Value="White"/>
        <Setter Property="Background" Value="{x:Null}"/>
        <Setter Property="VerticalAlignment" Value="Bottom"/>
        <Setter Property="BorderThickness" Value="0"/>
        <Setter Property="BorderBrush" Value="{x:Null}"/>
        <Setter Property="IsEnabled" Value="True"/>
        <Setter Property="FontFamily" Value="Segoe360"/>
        <Setter Property="FontSize" Value="17"/>
    </Style>
    
    <!-- Fade in animation-->
    <Storyboard x:Key="fadein">
        <DoubleAnimation
            Storyboard.TargetProperty="Opacity"
            From="0" To="1" Duration="0:0:1"/>
    </Storyboard>
    
    <!--DataTemplate for Image and Image name-->
    <DataTemplate x:Key="ImageAndCaptionTemplate">
        <Grid Background="Black">
            <Grid.Triggers>
                <EventTrigger RoutedEvent="Grid.Loaded">
                    <BeginStoryboard Storyboard="{StaticResource fadein}"/>
                </EventTrigger>
            </Grid.Triggers>
            <Image x:Name="ImageElm" Source="{Binding ScreenshotSource}" VerticalAlignment="Center" HorizontalAlignment="Center"/>
            <Label Content="{Binding Name}" Style="{StaticResource TileStyle}"/>
        </Grid>
    </DataTemplate>
    
    <!--DataTemplate for Video-->
    <DataTemplate x:Key="VideoAndCaptionTemplate" DataType="{x:Type cs:MainBarVideo}">
        <Grid Background="Black">
            <Grid.Triggers>
                <EventTrigger RoutedEvent="Grid.Loaded">
                    <BeginStoryboard Storyboard="{StaticResource fadein}"/>
                </EventTrigger>
            </Grid.Triggers>
            <Image x:Name="ImageElm" Source="{Binding ScreenshotSource}" Stretch="Uniform"/>
            <Label Content="{Binding Name}" Style="{StaticResource TileStyle}"/>
        </Grid>
    </DataTemplate>
    
    <!-- DataTemplate for Document type with Caption showing -->
    <DataTemplate x:Key="DocAndCaptionTemplate">
        <Grid Background="Black">
            <Grid.Triggers>
                <EventTrigger RoutedEvent="Grid.Loaded">
                    <BeginStoryboard Storyboard="{StaticResource fadein}"/>
                </EventTrigger>
            </Grid.Triggers>
            
            <Border Background="White" Grid.Row="0">
                <Grid Margin="20, 10">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto" />
                        <RowDefinition Height="Auto" />
                        <RowDefinition Height="*" />
                    </Grid.RowDefinitions>
                    
                    <Image Grid.Row="0" x:Name="ImageElm" Source="{Binding ScreenshotSource}"
                           VerticalAlignment="Center" HorizontalAlignment="Left" Stretch="Uniform" />
                    
                    <Label Grid.Row="1" x:Name="Title" Content="{Binding Name}" 
                           Foreground="Black" FontWeight="ExtraBold"/>
                    <Label Grid.Row="2" x:Name="Content" Content="{Binding ContentExcerpt}"
                           Foreground="DarkGray"/>
                </Grid>
            </Border>
        </Grid>
    </DataTemplate>

    <!-- DataTemplateSelector used to switch between three different media type
        Used in the second view of the Main Winddow, ControlPanel
    -->
    <cs:MainBarDataTemplateSelector x:Key="mainBarDataTemplateSelector" 
                                            ImageTemplate="{StaticResource ImageAndCaptionTemplate}"
                                            VideoTemplate="{StaticResource VideoAndCaptionTemplate}"
                                            DocTemplate="{StaticResource DocAndCaptionTemplate}"/>


    <!-- Base style used by LibraryStackItem in LibraryStack and ScatterViewItem in ScatterLayer. -->
    <Style x:Key="BaseItemStyle" TargetType="{x:Type ContentControl}">
        <Setter Property="MinHeight" Value="150" />
        <Setter Property="MinWidth" Value="100" />
    </Style>
    
    <!-- Deprecated since no drag event for the main bar anymore, Save for furture usage -->
    <Style x:Key="CursorStyle" TargetType="{x:Type ContentControl}">
        <Setter Property="Opacity" Value="0.5"/>
        <Setter Property="ContentTemplate" Value="{StaticResource ImageAndCaptionTemplate}" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type ContentControl}">
                    <ContentPresenter
                            	Content="{TemplateBinding Content}"
                            	ContentTemplate="{TemplateBinding ContentTemplate}">
                    </ContentPresenter>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
    <Color x:Key="CS1">#FFEF342B</Color>
    <Color x:Key="CS2">#FF1EC4F4</Color>
    <Color x:Key="CS3">#FFCE65A7</Color>
    <Color x:Key="CS4">#FF005897</Color>
	<Color x:Key="CS5">#FFB4B8BB</Color>
</ResourceDictionary>